import {
    extendObservable,
    observable
} from 'mobx'

// 1.对于数组，纯对象和Map，直接把observable当做函数，把变量转换为可观察的对象
// 2.对于上面没有包含的其他类型，必须调用observable.box 来将变量包装为可观察的对象，之后对该变量的直接赋值将会被监视

// array object map

// array
const arr = observable(['a', 'b', 'c'])
// object
const obj = observable({
    a: 1,
    b: 2
})
console.log(obj.a);
// proxy 可以监视新增加的数据
obj.c = 3;
// console.log(obj.c); // 3

// map 
const map = observable(new Map())

map.set('a', 1)

// console.log(map.has('a')); // true

// 对于其他类型虽然没有监控，但可以对变量本身监控
const num = observable.box(20);
const str = observable.box('hello');
const bool = observable.box(true);

// get 方法可以返回原始类型值
console.log(num.get(), str, bool);
// set 方法可以修改原始类型值
num.set(50)
console.log(num.get());

class Store {
    @observable array = [];
    @observable obj = {};
    @observable map = new Map();
    // 会自动识别，不用手动区分可观察还是间接观察
    @observable string = 'hello';
    @observable number = 20;
    @observable bool = false;
}